<template>
  <router-view id="root"></router-view>
</template>
<script>
import axios from '../api';
export default {
  data: () => ({
    drawer: null,
    drawerSwitch: 1,
    articleTitle: '',
    articleSubTitle: '',
    articleContent: '',
    iamgeIndex: 0,
    imageName: '',
    currentImage: {name: ''},
    markedArticle: '',
    transArticle: '',
    imageList: []
  }),
  props: {
    source: String
  },
  components: {
  },
  methods: {
    gotoPage(value) {
      this.drawerSwitch = value;
    },
  }
}
</script>
<style lang="less">

#marked-article {
  text-align: left;
  font-size: 18px;
  padding: 0.8rem 1rem;
  height: 100%;
}

img {
  width: 100%;
}

.article-content {
  min-height: 12em;
  width: 100%;
  text-align: left;
  padding: 1em;
  font-size: 1.2rem;
}

.image-list {
  li {
    display: flex;
    flex-direction: column;
    list-style: none;
    .image-list-item {
      width: 5rem;
    }
    .image-list-name {
      font-size: 1rem;
    }
  }
  
}

.input-wrapper {
  display: inline-block;
  position: relative;
  // width: 6rem;
  // height: 3.2rem;
  // border: 2px dashed #5ff44a;
  // border-radius: 4px;
  .file-input {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
  }
}
</style>